.divider {
  display: flex;
  align-items: center;
  justify-content: center;
  hr {
    border: none;
    height: 1px;
    width: 100%;
    background-color: var(--tableLightestBorderColor)
  }
  &-vertical {
    height: auto;
    hr {
      height: 100%;
      width: 1px;
    }
  }

  &-middle {
    margin: 6px 12px;
    &.divider-vertical {
      margin: 12px 6px;
    }
  }

  &-half {
    hr {
      width: 50%;
    }
    &.divider-vertical {
      margin: 0 8px;
      hr {
        width: 1px;
        height: 50%;
      }
    }
  }
}

